<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
    <title>101HeadAndFoot_01</title>
    <meta http-equiv="Content-Type" content="text/html;charset=utf-8"/>
    <script type="text/javascript" charset="utf-8" src="${pageContext.request.contextPath}/ueditor/ueditor.config.js?v=111"></script>
    <script type="text/javascript" charset="utf-8" src="${pageContext.request.contextPath}/ueditor/ueditor.all.min.js?v=111"> </script>
    <!--建议手动加在语言，避免在ie下有时因为加载语言失败导致编辑器加载失败-->
    <!--这里加载的语言文件会覆盖你在配置项目里添加的语言类型，比如你在配置项目里配置的是英文，这里加载的中文，那最后就是中文-->
    <script type="text/javascript" charset="utf-8" src="${pageContext.request.contextPath}/ueditor/lang/zh-cn/zh-cn.js?v=111"></script>
    <script type="text/javascript" src="${pageContext.request.contextPath}/ueditor/third-party/jquery-1.10.2.min.js"></script>
</head>
<body>
    <h1>101HeadAndFoot_01</h1><!-- from RRKEMR_Print003 -->

	<h2><input type="button" id="btn02" value="My Iframe打印"></h2>
    <!--style给定宽度可以影响编辑器的最终宽度-->
    <script type="text/plain" id="myEditor" style="width:1024px;height:500px;">
        <p>这里我可以写一些输入提示</p>
    </script>
    <script type="text/javascript">
        var editor01 = UE.getEditor('myEditor');
		$(function(){
			var btn02 = $('#btn02');
			
			btn02.on('click', function(){
				console.log( editor01 );
				// console.log( editor01.iframe );
				/* console.log( editor01.iframe.id );
				console.log( editor01.iframe.contentWindow.document );
				
				var heads = $('*', editor01.iframe.contentWindow.document.head);
				$.each(heads, function(i,n){
					console.log( $(n)[0].outerHTML );
				});
				
				console.log("======*======");
				
				var bodys = $('*', editor01.iframe.contentWindow.document.body);
				$.each(bodys, function(i,n){
					var ele = $(n);
					console.log( ele.outerHeight() );
					console.log( ele[0].outerHTML );
				}); */
				
				// return false;
				
				var UE_html = editor01.getAllHtml();
				// console.log( UE_html );
				// return false;
				
				var $ifr_00 = $('#ifr_00');
				if($ifr_00[0]){
					$ifr_00.remove();
				}
				
				var tplIfr = '<iframe id="ifr_00" style="width:0;height:0;padding:0;margin:0;position:absolute;left;0;top:0;"></iframe>';
				$('body').append( tplIfr );
				
				setTimeout(function(){
					$ifr_00 = $('#ifr_00');
					if($ifr_00[0]){
						var _ifr = $ifr_00[0];
						var _doc = _ifr.contentWindow.document;
						
						_doc.open();
						_doc.write('<html><head><meta http-equiv="Content-Type" content="text/html;charset=utf-8"/><title></title>');
						
						// 从iframe中抽取样式"style"
						// _doc.write( $('style', document)[0].outerHTML );
						var heads = $('*', editor01.iframe.contentWindow.document.head);
						$.each(heads, function(i,n){
							_doc.write( $(n)[0].outerHTML );
							// console.log( $(n)[0].outerHTML );
						});
						
						// 写入我自己的样式, 也可以将样式定义在"iframe.oneEditorPrint.css"
						_doc.write('<style id="emr_style_001">');
						_doc.write('@page{margin-top:0;margin-bottom:0;margin-left:0;margin-right:0;}');
						_doc.write('@media print{body{background:#fff;margin-top:0;margin-bottom:0;margin-left:0;margin-right:0;}}');
						_doc.write('</style>');
						
						_doc.write('</head><body>');
						
						// 先把table写入到目标firame中
						// _doc.write($('table', document.body)[0].outerHTML);
						_doc.write('<table id="page_1" style="margin:0;padding:0;border:0 !important;"><tr height="1110px" style="margin:0;padding:0;border:0 !important;"><td width="56px" style="margin:0;padding:0;border:0 !important;"></td><td width="668px" style="margin:0;padding:0;border:0 !important;"><div style="height:24px;width:668px;margin:0;padding:0;"></div>');
						// -- emr_head --
						_doc.write('<div style="height:97px;width:668px;margin:0;padding:0;overflow:hidden;" class="emr_head">');
						_doc.write('<div style="font-family:宋体;font-size:18pt;font-weight:bold;letter-spacing:0.1em;padding-top:0.25em;text-align:center;">人人康科技医院</div>');
						_doc.write('<div style="font-family:宋体;font-size:15.75pt;letter-spacing:0.2em;padding-top:0.25em;text-align:center;">入院记录</div>');
						_doc.write('<div style="font-family:宋体;font-size:10.5pt;padding-top:0.5em;"> 姓名: 王思思&nbsp;&nbsp;性别: 女&nbsp;&nbsp;科别: 外科&nbsp;&nbsp;床号: 302&nbsp;&nbsp;病案号: 20171224001</div><hr style="margin:4px 0 2px 0;padding:0;" /></div>');
						// -- emr_main {Begin}--
						_doc.write('<div style="height:942px;width:668px;margin:0;padding:0;overflow:hidden;" class="emr_main">');
						
						// 从iframe中抽取"body"中的元素
						var bodys = $('*', editor01.iframe.contentWindow.document.body);
						$.each(bodys, function(i,n){
							var ele = $(n);
							_doc.write( ele[0].outerHTML );
						});
						
						_doc.write('</div>');
						// -- emr_main {End}--
						
						// -- emr_foot --
						_doc.write('<div style="height:30px;width:668px;margin:0;padding:0;overflow:hidden;" class="emr_foot"><hr style="margin:4px 0 2px 0;padding:0;" />');
						_doc.write('<div style="font-family:宋体;font-size:11pt;text-align:center;">第 1 页</div></div>');
						_doc.write('<div style="height:15px;width:668px;margin:0;padding:0;"></div></td></tr></table>');
						
						_doc.write( '<script type="text\/javascript">window.onload=function(){window.print();};<\/script>' );
						_doc.write('</body></html>');
						
						_doc.close();
						
						/*setTimeout(function(){
							$(_ifr.contentWindow.document).ready(function(){
								var _body = $(_ifr.contentWindow.document.body);
								_ifr.contentWindow.print();
							});
						}, 1);*/
					}
				},1);
			});
		});
    </script>

</body>
</html>